<template>
	<view>
		<view>

			

			<view style="margin-top:30rpx">
				
				<view  class="row mainContentWrap"  style="font-weight: bold;border-bottom: unset;">
					<view style="color: #515c6f;flex:1;text-align: center">
						上机名称
					</view>	
					<view style="color: #515c6f;flex:1;text-align: center">
						科目名称
					</view>	
					<view style="color: #515c6f;flex:1;text-align: center">
						班级
					</view>	
					<view style="color: #515c6f;flex:1;text-align: center">
						完成率
					</view>	
				</view>	
				<view v-for="(item,index) in abnormalArr" :key="index" style="margin: 20rpx 0 20rpx;">
					<view  class="row mainContentWrap" @click="abnormalIndexSkip(item)">

						<view style="color: #515c6f;flex:1;text-align: center">
							{{item.clsPracticeName}}
						</view>
						<view style="color: #515c6f;flex:1;text-align: center">
							{{item.courseName}}
						</view>
						<view style="color: #515c6f;flex:1;text-align: center">
							{{item.className}}
						</view>
						
						<view style="color: #515c6f;flex:1;text-align: center">
							{{item.passRate}}
						</view>

					</view>
				</view>
			</view>
			<!-- <view class="logoSty"></view> -->
		</view>
		<!-- <my-bottom :topName="topName" :bottomArr="Attbottoms"></my-bottom> -->
	</view>
</template>

<script>
	import topCom from '../component/topCom.vue'
	import bottomCom from '../component/bottom.vue'
	import headTitle from '../component/btnHeadeCom.vue'
	export default {
		data() {

			return {
				startDate:'',
				endDate:'',
				patrolType: '',
				rangeType: [{
						value: '',
						text: "全部"
					}, {
						value: "2",
						text: "入校"
					},
					{
						value: "3",
						text: "课堂"
					},
					{
						value: "4",
						text: "午休"
					}, {
						value: "5",
						text: "晚自习"
					}, {
						value: "6",
						text: "课间"
					}, {
						value: "1",
						text: "宿舍"
					},
				],
				range: [],
				userName: '',
				topName: '上机数据',
				id: '',
				abnormalArr: [],
				Attbottoms: [{
						name: 'home',
						icon: 'iconfont icon-yonghutongji',
						text: "首页",
						path: '/pages/classManagement/classManagementIndex'
					},

					{
						name: 'maintenance',
						icon: 'iconfont icon-shezhi',
						text: "退出",
						path: '/pages/index/login'
					},
				],
			}
		},
		components: {
			topCom,
			bottomCom,
			headTitle
		},
		filters: {
			showPatrolType(type) {
				// 2:入校入校巡查 3:课堂巡查 4:午休巡查 5:晚自习巡查 6:课间巡查
				if (type == "2") {
					return "入校";
				} else if (type == "3") {
					return "课堂";
				} else if (type == "4") {
					return "午休";
				} else if (type == "5") {
					return "晚自习";
				} else if (type == "6") {
					return "课间";
				} else if (type == "1") {
					return "宿舍";
				}
			},
			showHandle(status) {
				if (status == 0) {
					return '未处理';
				} else if (status == 1) {
					return "已处理";
				}
			}
		},
		onLoad() {


			

			var that = this
			uni.getStorage({
				key: "loginName",
				success: (res) => {
					that.userName = res.data
				}
			})
			uni.getStorage({
				key: "loginId",
				success: (res) => {
					that.id = res.data
				}
			})

			

			var loginId = uni.getStorageSync("loginId");
			
				uni.request({
				url:uni.url+'clsPractice/findClsPracticeList',
				method:'POST',
				data:{
					"userId":loginId
				},
				success:res=>{
					console.log(res);
					this.abnormalArr = res.data.data;
				}
			})
		},
		methods: {
			
			abnormalIndexSkip(item) {
				uni.navigateTo({
					url:"/pages/record/pcRecodeDetail?str="+JSON.stringify(item)
				})
				// console.log(item)
			}
		},

	}
</script>

<style lang="scss">
	// .choose-type /deep/ .uniui-clear{
	// 	color: white !important;
	// }
	/deep/ .uni-select {
		border: unset;
		padding: 20rpx 20rpx 0 50rpx;
	}

	.mainContentWrap {
		
		border-bottom: #e9e9ee solid 1rpx;
		height: 70rpx;
		border-radius: 5rpx;
		// margin-top: 10rpx;
		width: 86%;
		margin: 0 auto;
		margin-left: 22rpx;
		// box-shadow: 0upx 0upx 3upx 0upx #8F8F94;
		display: flex;
		justify-content: space-between;
		align-content: space-around;
		align-items: center;

	}

	.row {
		display: flex;
		justify-content: space-around;
		padding: 10rpx 30rpx;
		
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.indexTeacher2 {
		margin: auto;
		margin-top: 40upx;
		width: 605upx;
		height: 76upx;
		display: flex;
		justify-content: space-between;
		background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/T-5.png);
		background-size: 100%;
		color: white;
		padding-top: 30upx;
		font-size: 30rpx;
		/* opacity: 0.8; */
	}

	.indexTeacher0 {
		margin: auto;
		margin-top: 40upx;
		width: 605upx;
		height: 76upx;
		display: flex;
		justify-content: space-between;
		background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/T-6.png);
		background-size: 100%;
		color: white;
		padding-top: 30upx;
		font-size: 30rpx;
		/* opacity: 0.8; */
	}

	.indexTeacher1 {
		margin: auto;
		margin-top: 40upx;
		width: 605upx;
		height: 76upx;
		display: flex;
		justify-content: space-between;
		background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/T-4.png);
		background-size: 100%;
		color: white;
		padding-top: 30upx;
		font-size: 30rpx;
		/* opacity: 0.8; */
	}
	.indexContent{
		height:100vh
	}
	.indexContent2{
		height: 100vh !important
	}
</style>
